// 所有用到的 echarts option 都在这里进行配置
// import * as echarts from 'echarts'
const chartOpt = {
  flowData(data) {
    const option = {
      title: {
        text: '人流量数据'
      },
      grid: {
        x: 50,
        y: 100,
        x2: 50,
        y2: 50,
        borderWidth: 10
      },
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'cross',
          label: {
            backgroundColor: '#283b56'
          }
        }
      },
      legend: {
        // data: ['今日网站访问量', '今日俱乐部人流量']
      },
      toolbox: {
        show: true,
        feature: {
          dataView: {
            readOnly: false
          },
          restore: {},
          saveAsImage: {}
        }
      },
      dataZoom: {
        show: false,
        start: 0,
        end: 100
      },
      xAxis: [{
        type: 'category',
        boundaryGap: true,
        data: [
          ['6:00'],
          ['9:00'],
          ['12:00'],
          ['15:00'],
          ['18:00'],
          ['21:00']
        ]
      },
      {
        type: 'category',
        boundaryGap: true,
        data: (function() {
          var res = []
          var len = 10
          while (len--) {
            res.push(10 - len - 1)
          }
          return res
        })()
      }
      ],
      yAxis: [{
        type: 'value',
        scale: true,
        name: '人数',
        max: 100,
        min: 0,
        boundaryGap: [2, 2]
      },
      {
        type: 'value',
        scale: true,
        name: '网站流量',
        max: 400,
        min: 0,
        boundaryGap: [2, 2]
      }
      ],
      series: [{
        name: '昨日网站访问量',
        type: 'bar',
        xAxisIndex: 1,
        yAxisIndex: 1,
        data: (function() {
          var res = []
          var len = 10
          while (len--) {
            res.push(Math.round(Math.random() * 400))
          }
          return res
        })()
      },
      {
        name: '昨日人流量',
        type: 'line',
        data: (function() {
          var res = []
          var len = 0
          while (len < 10) {
            res.push((Math.random() * 50 + 5).toFixed(1) - 0)
            len++
          }
          return res
        })()
      }
      ]
    }
    return option
  },
  // 温湿度折线图
  pieWarinFour(data, dimensions) {
    const option = {
      // title: {
      //   text: '温湿度折线图'
      // },
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'cross',
          label: {
            backgroundColor: '#6a7985'
          }
        }
      },
      dataset: {
        dimensions: dimensions,
        source: data
      },
      legend: {
        right: 10,
        icon: 'circle'
      },
      grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
      },
      xAxis: {
        type: 'category',
        boundaryGap: false
      },
      yAxis: {
        type: 'value'
      },
      series: [{
        type: 'line',
        name: '温度',
        markPoint: {
          data: [{
            type: 'max',
            name: 'Max'
          },
          {
            type: 'min',
            name: 'Min'
          }
          ]
        },
        markLine: {
          data: [{
            type: 'average',
            name: 'Avg'
          }]
        }
      },
      {
        type: 'line',
        name: '湿度',
        markPoint: {
          data: [{
            type: 'max',
            name: 'Max'
          },
          {
            type: 'min',
            name: 'Min'
          }
          ]
        },
        markLine: {
          data: [{
            type: 'average',
            name: 'Avg'
          }]
        }
      }
      ]
    }
    return option
  },
  // 传感器数据折线图
  sensorData(data, dimensions) {
    const option = {
      // title: {
      //   text: '传感器数据折线图'
      // },
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'cross',
          label: {
            backgroundColor: '#6a7985'
          }
        }
      },
      dataset: {
        dimensions: dimensions,
        source: data
      },
      legend: {
        right: 10,
        icon: 'circle'
      },
      grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
      },
      xAxis: {
        type: 'category',
        boundaryGap: false
      },
      yAxis: {
        type: 'value'
      },
      series: [
        {
          type: 'line',
          name: '光照强度',
          markPoint: {
            data: [{
              type: 'max',
              name: 'Max'
            },
            {
              type: 'min',
              name: 'Min'
            }
            ]
          },
          markLine: {
            data: [{
              type: 'average',
              name: 'Avg'
            }]
          }
        },
        {
          type: 'line',
          name: '土壤湿度',
          markPoint: {
            data: [{
              type: 'max',
              name: 'Max'
            },
            {
              type: 'min',
              name: 'Min'
            }
            ]
          },
          markLine: {
            data: [{
              type: 'average',
              name: 'Avg'
            }]
          }
        },
        {
          type: 'line',
          name: '二氧化碳浓度',
          markPoint: {
            data: [{
              type: 'max',
              name: 'Max'
            },
            {
              type: 'min',
              name: 'Min'
            }
            ]
          },
          markLine: {
            data: [{
              type: 'average',
              name: 'Avg'
            }]
          }
        }

      ]
    }
    return option
  },
  // 温度数据
  temperature(data) {
    const option = {
      title: {
        text: '实时温度'
      },
      tooltip: {
        formatter: '{b} : {c} ℃'
      },
      series: [{
        type: 'gauge',
        min: 0,
        max: 150,
        axisLine: {
          lineStyle: {
            color: [
              [0.3, '#67e0e3'],
              [0.7, '#37a2da'],
              [1, '#fd666d']
            ]
          }
        },
        pointer: {
          itemStyle: {
            color: 'auto'
          }
        },
        axisTick: {
          distance: 0,
          lineStyle: {
            color: 'auto'
          }
        },
        splitLine: {
          distance: 0,
          length: 10,
          lineStyle: {
            color: 'auto'
          }
        },
        axisLabel: {
          color: 'auto'
        },
        title: {
          show: false,
          fontSize: 25,
          fontWeight: 'bold',
          offsetCenter: ['0', '120%']
        },
        detail: {
          valueAnimation: true,
          fontSize: 25,
          offsetCenter: [0, '110%'],
          formatter: '{value} ℃',
          color: 'auto'
        },
        data: [{
          value: data,
          name: '温度'
        }]
      }]
    }
    return option
  },
  // 湿度数据
  humidity(data) {
    const option = {
      title: {
        text: '实时湿度'
      },
      tooltip: {
        formatter: '{b} : {c} %'
      },
      series: [{
        type: 'gauge',
        min: 0,
        max: 200,
        axisLine: {
          lineStyle: {
            color: [
              [0.3, '#67e0e3'],
              [0.7, '#37a2da'],
              [1, '#fd666d']
            ]
          }
        },
        pointer: {
          itemStyle: {
            color: 'auto'
          }
        },
        axisTick: {
          distance: 0,
          lineStyle: {
            color: 'auto'
          }
        },
        splitLine: {
          distance: 0,
          length: 10,
          lineStyle: {
            color: 'auto'
          }
        },
        axisLabel: {
          color: 'auto'
        },
        title: {
          show: false,
          fontSize: 25,
          fontWeight: 'bold',
          offsetCenter: ['0', '100%']
        },
        detail: {
          valueAnimation: true,
          fontSize: 25,
          offsetCenter: [0, '110%'],
          formatter: '{value} %',
          color: 'auto'
        },
        data: [{
          value: data,
          name: '湿度'
        }]
      }]
    }
    return option
  },
  // 湿度数据
  lightIntensity(data) {
    const option = {
      title: {
        text: '实时光照强度'
      },
      tooltip: {
        formatter: '{b} : {c} lux'
      },
      series: [{
        type: 'gauge',
        min: 0,
        max: 2500,
        axisLine: {
          lineStyle: {
            color: [
              [0.3, '#67e0e3'],
              [0.7, '#37a2da'],
              [1, '#fd666d']
            ]
          }
        },
        pointer: {
          itemStyle: {
            color: 'auto'
          }
        },
        axisTick: {
          distance: 0,
          lineStyle: {
            color: 'auto'
          }
        },
        splitLine: {
          distance: 0,
          length: 10,
          lineStyle: {
            color: 'auto'
          }
        },
        axisLabel: {
          color: 'auto'
        },
        title: {
          show: false,
          fontSize: 25,
          fontWeight: 'bold',
          offsetCenter: ['0', '100%']
        },
        detail: {
          valueAnimation: true,
          fontSize: 25,
          offsetCenter: [0, '110%'],
          formatter: '{value} Lux',
          color: 'auto'
        },
        data: [{
          value: data,
          name: '光照强度'
        }]
      }]
    }
    return option
  },
  // 土壤湿度数据
  soilMoisture(data) {
    const option = {
      title: {
        text: '实时土壤湿度'
      },
      tooltip: {
        formatter: '{b} : {c} %'
      },
      series: [{
        type: 'gauge',
        min: 0,
        max: 4000,
        axisLine: {
          lineStyle: {
            color: [
              [0.3, '#67e0e3'],
              [0.7, '#37a2da'],
              [1, '#fd666d']
            ]
          }
        },
        pointer: {
          itemStyle: {
            color: 'auto'
          }
        },
        axisTick: {
          distance: 0,
          lineStyle: {
            color: 'auto'
          }
        },
        splitLine: {
          distance: 0,
          length: 10,
          lineStyle: {
            color: 'auto'
          }
        },
        axisLabel: {
          color: 'auto'
        },
        title: {
          show: false,
          fontSize: 25,
          fontWeight: 'bold',
          offsetCenter: ['0', '100%']
        },
        detail: {
          valueAnimation: true,
          fontSize: 25,
          offsetCenter: [0, '110%'],
          formatter: '{value} %',
          color: 'auto'
        },
        data: [{
          value: data,
          name: '土壤湿度'
        }]
      }]
    }
    return option
  },
  // 二氧化碳数据
  carbonDioxide(data) {
    const option = {
      title: {
        text: '实时二氧化碳'
      },
      tooltip: {
        formatter: '{b} : {c} ppm'
      },
      series: [{
        type: 'gauge',
        min: 0,
        max: 4000,
        axisLine: {
          lineStyle: {
            color: [
              [0.3, '#67e0e3'],
              [0.7, '#37a2da'],
              [1, '#fd666d']
            ]
          }
        },
        pointer: {
          itemStyle: {
            color: 'auto'
          }
        },
        axisTick: {
          distance: 0,
          lineStyle: {
            color: 'auto'
          }
        },
        splitLine: {
          distance: 0,
          length: 10,
          lineStyle: {
            color: 'auto'
          }
        },
        axisLabel: {
          color: 'auto'
        },
        title: {
          show: false,
          fontSize: 25,
          fontWeight: 'bold',
          offsetCenter: ['0', '100%']
        },
        detail: {
          valueAnimation: true,
          fontSize: 25,
          offsetCenter: [0, '110%'],
          formatter: '{value} ppm',
          color: 'auto'
        },
        data: [{
          value: data,
          name: '二氧化碳'
        }]
      }]
    }
    return option
  }
}

export default chartOpt
